import {AfterViewInit,AfterContentInit,Component, OnInit, ElementRef,Input,Output,EventEmitter} from '@angular/core';
import {TileObject} from './tile.component';
import {ContainerTileObject} from './containerTile.component';

@Component({
    selector: 'groupContainerTile',
    template: 
    `
        <div *ngFor="let item of groupTiles">
            <containerTile (TilePress)="tilePress($event)" *ngIf="item.tiles.length>0" [containerTiles]=item></containerTile>
        </div>
    `       
})

export class GroupContainerTile implements OnInit , AfterContentInit ,AfterViewInit{
    @Input() groupTiles: ContainerTileObject[];
    @Output() public TilePress = new EventEmitter();

    InEdit:boolean= false;
    constructor(private element: ElementRef) {   
    }
    ngOnInit() {

    }
    ngAfterContentInit() {
        
    }
    ngAfterViewInit() {
        
    }

    BeginEdit(){
        jQuery(this.element.nativeElement).find(".containerTileContent")["sortable"]()["disableSelection"]();
        jQuery(this.element.nativeElement)["sortable"]()["disableSelection"]();
        jQuery(this.element.nativeElement).find(".containerTileContent")["sortable"]("option", "disabled", false);
        jQuery(this.element.nativeElement)["sortable"]("option", "disabled", false);

        for(var i=0;i<this.groupTiles.length;i++){
            for(var j=0;j<this.groupTiles[i].tiles.length;j++){
                this.groupTiles[i].tiles[j].Edit=true;
            }   
        }
        
        this.InEdit = true;
    }
    EnEdit(){
        jQuery(this.element.nativeElement).find(".containerTileContent")["sortable"]("disable");
        jQuery(this.element.nativeElement)["sortable"]("disable");

        for(var i=0;i<this.groupTiles.length;i++){
            for(var j=0;j<this.groupTiles[i].tiles.length;j++){
                this.groupTiles[i].tiles[j].Edit=false;
            }   
        }
        
        this.InEdit = false;
    }

    tilePress(tile:any){
        this.TilePress.emit(tile)
    }
} 